<template>
  <ul class="adv">
    <li v-for="item in list" :key="item.id">
      <a href="javascript:;">
        <img :src="item.url" />
      </a>
    </li>
  </ul>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          id: Date.now() + 1,
          url: 'https://www.helloimg.com/images/2023/06/08/osMPT6.gif'
        },
        {
          id: Date.now() + 2,
          url: 'https://www.helloimg.com/images/2023/06/08/os2l6R.gif'
        },
        {
          id: Date.now() + 3,
          url: 'https://www.helloimg.com/images/2023/06/10/os7Fxn.gif'
        },
        {
          id: Date.now() + 4,
          url: 'https://www.helloimg.com/images/2023/06/08/os2bln.gif'
        },
      ]
    }
  }
}
</script>

<style>
.adv {
  display: flex;
  flex-wrap: wrap;
  padding: 5px;
}

.adv li {
  width: 50%;
  box-sizing: border-box;
  padding: 5px;
}

.adv li img {
  width: 100%;
  height: 120px;
}
</style>